<template>
  <ul class="bread">
    <li v-for="(item, index) in breadArr" :key="index">
      <span> {{ item }} <i>/</i> </span>
    </li>
  </ul>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: ["breadArr"],
};
</script>
 
<style lang = "less" scoped>
.bread {
  display: flex;
  padding: 20px 0;
  li {
    cursor: pointer;
    i {
      margin-right: 6px;
    }
    &:last-of-type {
      i {
        display: none;
      }
    }
    &:first-of-type {
      span {
        font-weight: bold;
      }
    }
  }
}
</style>